<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>动态查询</title>
    <link rel="shortcut icon" href="/img/favicon.ico" /><!--标签页面顶部的小图标-->
    <script th:src="@{/webjars/jquery/3.3.1/jquery.js}"></script>
    <link th:href="@{/webjars/bootstrap/4.0.0/css/bootstrap.css}" rel="stylesheet"/>
    <script th:src="@{/webjars/bootstrap/4.0.0/js/bootstrap.js}"></script>
    <script>
        function findDongTai(dtName,uName) {
            $.ajax({
                url:"/admin/findDongTai.do",
                type:"get",
                data:{dtName:dtName,uName:uName},
                success:function (result) {
                    $("#tbody").html("");
                    for (var i=0;i<result.length;i++){
                        var dongTai = result[i];
                        var time = new Date(dongTai.dtCreateTime);
                        var img;
                        if (dongTai.dtTuPian!=null&&dongTai.dtTuPian!=''){
                            img = "<img src='"+dongTai.dtTuPian+"' style='width: 45px;height: 60px'>"
                        }else {
                            img = "<font>暂无图片</font>"
                        }
                        $("#tbody").append("<tr>" +
                            "<td align='center'>"+(i+1)+"</td>" +
                            "<td>"+dongTai.dtName+"</td>" +
                            "<td><textarea readonly cols='40' rows='3'>"+dongTai.dtText+"</textarea></td>" +
                            "<td align='center'>"+img+"</td>" +
                            "<td align='center'>"+dongTai.uName+"</td>" +
                            "<td align='center'>"+dongTai.dtDianJiLiang+"</td>" +
                            "<td>"+time.getFullYear()+"-"+(time.getMonth()+1)+"-"+time.getDate()+"&nbsp;"+time.getHours()+":"+time.getMinutes()+":"+time.getSeconds()+"</td>" +
                            "<td><button class='btn btn-danger btn-sm' value='"+dongTai.dtId+"' onclick='deleteDongTaiByDtId(this)'>删除</button></td>" +
                            "</tr>")
                    }
                }
            })
        }

        $(function () {
            findDongTai(null,null);
        })

        function deleteDongTaiByDtId(dtId) {
            if (confirm("确定要删除该条动态吗？")){
                $.ajax({
                    url:"/admin/deleteDongTaiByDtId.do",
                    type:"get",
                    data:{dtId:$(dtId).val()},
                    success:function (result) {
                        alert("删除成功！");
                        $(dtId).parent("td").parent("tr").hide();
                    }
                })
            }
        }

        function find() {
            var dtName = $("#findByDtName").val();
            var uName = $("#findByUName").val();
            findDongTai(dtName,uName);
        }

        function clearNull() {
            $("#findByDtName").val("");
            $("#findByUName").val("");
        }
    </script>
</head>
<body>
    <div id="allText">
        <div style="width: 100%;height: 50px;margin-top: 30px;">
            <div style="float: left;width: 20%;height: 70px"></div>
            <div style="float: left;margin-right: 25px"><input type="text" id="findByDtName" placeholder="动态标题"></div>
            <div style="float: left"><input type="text" id="findByUName" placeholder="发布者"></div>
            <div style="float: left;margin-left: 20px"><button onclick="find();clearNull()" class="btn btn-sm" style="background-color: #5cb85c">查询</button></div>
        </div>
        <div>
            <table class="table table-striped" border="1">
                <thead>
                    <tr>
                        <td align='center'><b>序号</b></td>
                        <td><b>动态标题</b></td>
                        <td><b>动态文本</b></td>
                        <td align='center'><b>动态图片</b></td>
                        <td align='center'><b>动态发布者</b></td>
                        <td align='center'><b>浏览量</b></td>
                        <td ><b>发布时间</b></td>
                        <td><b>操作</b></td>
                    </tr>
                </thead>
                <tbody id="tbody"></tbody>
            </table>
        </div>
    </div>
</body>
</html>